/**
 * 积分商城-今日任务
 */
'use strict';
import React, {
    Component
} from 'react'
import {
    Link
} from 'react-router'

import Header from './Common/Header'
import {
    HttpService,
    dateFormat,
    Tips
} from '../Tools'

import imgCode from '../Img/mall/code.png'
import imgPk from '../Img/mall/pk2.png'

export default class packageDetail extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: 0
        }
    }

    componentWillMount() {
        this.getDetail()
    }

    //获取详情
    getDetail() {
        HttpService.query({
            // url: '/src/data/packageDetail.json',
            url: '/jf/peoplecard/getCard',
            async: false,
            data: {
                token: sessionStorage.appToken,
                serialNumber: this.props.params.id
            },
            success: (res => {
                if (res.code == 50006 && res.data) {
                    this.setState({
                        data: res.data
                    })
                }
            })
        })
    }
    render() {
        let {
            goodsArchName,
            logo,
            companyName,
            companyId,
            introduce,
            endTime,
            beginTime,
            serialNumber,
            contents
        } = this.state.data
        beginTime = dateFormat(new Date(beginTime), '-', false).replace(/\-/g, '.')
        endTime = dateFormat(new Date(endTime), '-', false).replace(/\-/g, '.')
        introduce = decodeURIComponent(introduce).replace(/<[^>]+>/g, '')
        contents = decodeURIComponent(contents)
        return (
            <div>
                <div className="packagedetails">
                    <Header title="卡券详情" />
                    {
                        this.state.data==0?<div className="datastatus"><span className="no">无卡券信息</span></div>:
                        <div>
                            <div className='bgc-white'>
                                <title>{goodsArchName}</title>
                                <div className='text-center'>
<img className='imgcode' src={`http://qr.liantu.com/api.php?m=0&w=200&text={"key":"suixunintegral","id":"${serialNumber}"}`} />
                                </div>
                                <div className='numbers'>
                                    <p>序列号：{serialNumber}</p>
                                    <p>有效期：{beginTime}-{endTime}</p>
                                </div>
                                <Link className='companybar' to={'/companyInfo/'+companyId}>
                                    <img src={logo} />
                                    <h5>{companyName}</h5>
                                    <p>{introduce}</p>
                                </Link>
                            </div>
                            <div className='packageintro'>
                                <h5 className='pkititle'>商品介绍：</h5>
                                <div className='content' dangerouslySetInnerHTML={{__html:contents}} />
                            </div>
                        </div>
                    }
                    </div>
            </div>
        )
    }
}
